<template>
  <div id="cluereportedit">
    <div v-show="pageLoading">数据加载中...</div>
    <el-form :model="editForm" label-width="200px" ref="editForm" :inline="true" style="padding:10px 0 0;clear:both" v-show="!pageLoading">
      <el-form-item label="单位" prop="dw" :rules="{ required: true, message: '请输入单位', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.dw}}</div>
        <el-autocomplete v-else style="width:400px" v-model="editForm.dw" :fetch-suggestions="querySearch" placeholder="请输入单位名称关键字" :trigger-on-focus="false" ></el-autocomplete>
      </el-form-item>
      <el-form-item label="部门" prop="bm">
        <div v-if="readOnly" class="details">{{editForm.bm}}</div>
        <el-input v-else v-model="editForm.bm" style="width:220px"></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="姓名" prop="xm" :rules="{ required: true, message: '请输入姓名', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.xm}}</div>
        <el-autocomplete v-else style="width:400px" v-model="editForm.xm" :fetch-suggestions="searchPerson" placeholder="请输入姓名" :trigger-on-focus="false" @select="handleSelect">
          <template slot-scope="{ item }">
            {{ item.value }}：{{ item.sex==='1'?'男':'女' }} {{ item.bm }} {{ item.job }} {{ item.jobLevel }} ({{ item.idcardno }})
          </template>
        </el-autocomplete>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="身份证号" prop="idcardno">
        <div v-if="readOnly" class="details">{{editForm.idcardno}}</div>
        <el-input v-else v-model="editForm.idcardno" style="width:220px"></el-input>
      </el-form-item>
      <el-form-item label="性别" prop="xb" :rules="{ required: true, message: '请输入性别', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.xb}}</div>
        <el-radio-group v-else v-model="editForm.xb">
          <el-radio label="男"></el-radio>
          <el-radio label="女"></el-radio>
        </el-radio-group>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="职务" prop="zw" :rules="{ required: true, message: '请输入职务', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.zw}}</div>
        <el-input v-else v-model="editForm.zw" style="width:220px"></el-input>
      </el-form-item>
      <el-form-item label="职务层次" prop="zwcc" :rules="{ required: true, message: '请输入职务层次', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.zwcc}}</div>
        <el-input v-else v-model="editForm.zwcc" style="width:220px"></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="主要违规违纪问题摘要" prop="zywgwjwtzy" :rules="{ required: true, message: '请输入主要违规违纪问题摘要', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.zywgwjwtzy}}</div>
        <el-input type="textarea" v-model="editForm.zywgwjwtzy" style="width:965px" v-else></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="问题来源" prop="wtly" :rules="{ required: true, message: '请选择问题来源', trigger: 'blur' }">
        <div v-if="readOnly" class="details">{{editForm.wtlyText}}</div>
        <el-select v-model="editForm.wtly" placeholder="请选择" v-else>
          <el-option v-for="(item, index) in wtlyDic" :key="index" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="其他问题来源" prop="qtwtly" v-show="editForm.wtly==='0810'">
        <div v-if="readOnly" class="details">{{editForm.qtwtly}}</div>
        <el-input v-model="editForm.qtwtly" style="width:220px" v-else></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="问题认定" prop="wtrd">
        <div v-if="readOnly" class="details" v-html="editForm.wtrd?editForm.wtrd.replace(/\n/g,'<br>'):''"></div>
        <el-input type="textarea" v-model="editForm.wtrd" style="width:965px" v-else></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="立案时间" prop="lasj">
        <div v-if="readOnly" class="details">{{editForm.lasj}}</div>
        <el-date-picker v-else
          v-model="editForm.lasj"
          placeholder="请选择立案时间"
          value-format="yyyy-MM-dd">
        </el-date-picker>
      </el-form-item>
      <el-form-item label="立案决定机关" prop="lajdjg">
        <div v-if="readOnly" class="details">{{editForm.lajdjg}}</div>
        <el-input v-else v-model="editForm.lajdjg" style="width:220px"></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="处理处分类型" prop="cllx">
      <div v-if="readOnly">
        <div v-if="cllx&&cllx.length>0">
          <div v-if="cllx[0]==='***'">***</div>
          <div v-else v-for="(item,index) in cllxDic" :key="index" style="clear:both" v-show="JSON.stringify(cllx).indexOf(item.value)>-1">
            <div style="width:150px;font-size:var(--size14) !important;display:block;float:left;text-align:right;font-weight:bolder">{{item.label}}：</div>
            <div style="font-size:var(--size14) !important;display:block;float:left;padding-left:10px" v-for="(it,idx) in item.children" :key="idx" v-show="cllx.indexOf(it.value)>-1">{{it.label}}</div>
            <!-- <div style="font-size:var(--size14) !important;display:block;float:left;" v-show="item.value==='0901'&&cllx.indexOf('090105')>-1">（{{qtcllx['090105']}}）</div>
            <div style="font-size:var(--size14) !important;display:block;float:left;" v-show="item.value==='0902'&&cllx.indexOf('090206')>-1">（{{qtcllx['090206']}}）</div> -->
            <div style="font-size:var(--size14) !important;display:block;float:left;" v-show="item.value==='0905'&&cllx.indexOf('0905')>-1">（{{qtcllx['0905']}}）</div>
          </div>
        </div>
      </div>
        <el-checkbox-group v-model="cllx" v-else @change="changeCllx">
          <div v-for="(item,index) in cllxDic" :key="index">
            <div style="width:150px;font-size:var(--size14) !important;display:block;float:left;text-align:right;padding-right:20px;font-weight:bolder">{{item.label}}</div>
            <el-checkbox v-for="(it,idx) in item.children" :key="idx" :label="it.value">{{it.label}}</el-checkbox>
            <el-checkbox  v-show="item.value==='0905'" label="0905" style="margin-right:30px">其他</el-checkbox>
            <!-- <el-input v-show="item.value==='0901'&&cllx.indexOf('090105')>-1" v-model="qtcllx['090105']" style="width:220px"></el-input>
            <el-input v-show="item.value==='0902'&&cllx.indexOf('090206')>-1" v-model="qtcllx['090206']" style="width:220px"></el-input> -->
            <el-input v-show="item.value==='0905'&&cllx.indexOf('0905')>-1" v-model="qtcllx['0905']" style="width:220px"></el-input>
          </div>
        </el-checkbox-group>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="处理处分内容" prop="clnr">
        <div v-if="readOnly" class="details" v-html="editForm.clnr?editForm.clnr.replace(/\n/g,'<br>'):''"></div>
        <el-input type="textarea" v-model="editForm.clnr" style="width:965px" v-else></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showRcjdglfs">
        <legend>日常监督管理方式</legend>
        <el-form-item label="处理决定机关" prop="cljdjg3" :rules="{ required: true, message: '请选择处理决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjg3Text}}</div>
          <el-select v-model="editForm.cljdjg3" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处理决定机关" prop="qtcljdjg3" v-show="editForm.cljdjg3==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg3}}</div>
          <el-input v-model="editForm.qtcljdjg3" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处理决定时间" prop="cljdsj3" :rules="{ required: true, message: '请选择处理决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj3}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj3"
            placeholder="请选择处理决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq3" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxq3Text}}</div>
          <el-select v-model="editForm.yxq3" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq3" v-show="editForm.yxq3==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq3}}</div>
          <el-input v-model="editForm.qtyxq3" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws3" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws3}}</div>
          <el-input v-model="editForm.jdws3" v-else></el-input>
        </el-form-item>
      </fieldset>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showZzcl">
        <legend>组织处理</legend>
        <el-form-item label="处理决定机关" prop="cljdjg4" :rules="{ required: true, message: '请选择处理决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjg4Text}}</div>
          <el-select v-model="editForm.cljdjg4" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处理决定机关" prop="qtcljdjg4" v-show="editForm.cljdjg4==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg4}}</div>
          <el-input v-model="editForm.qtcljdjg4" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处理决定时间" prop="cljdsj4" :rules="{ required: true, message: '请选择处理决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj4}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj4"
            placeholder="请选择处理决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq4" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxq4Text}}</div>
          <el-select v-model="editForm.yxq4" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq4" v-show="editForm.yxq4==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq4}}</div>
          <el-input v-model="editForm.qtyxq4" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws4" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws4}}</div>
          <el-input v-model="editForm.jdws4" v-else></el-input>
        </el-form-item>
      </fieldset>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showZjcf">
        <legend>政纪处分</legend>
        <el-form-item label="处分决定机关" prop="cljdjg" :rules="{ required: true, message: '请选择处分决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjgText}}</div>
          <el-select v-model="editForm.cljdjg" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处分决定机关" prop="qtcljdjg" v-show="editForm.cljdjg==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg}}</div>
          <el-input v-model="editForm.qtcljdjg" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处分决定时间" prop="cljdsj" :rules="{ required: true, message: '请选择处分决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj"
            placeholder="请选择处分决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxqText}}</div>
          <el-select v-model="editForm.yxq" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq" v-show="editForm.yxq==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq}}</div>
          <el-input v-model="editForm.qtyxq" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws}}</div>
          <el-input v-model="editForm.jdws" v-else></el-input>
        </el-form-item>
      </fieldset>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showZwcf">
        <legend>政务处分</legend>
        <el-form-item label="处分决定机关" prop="cljdjg6" :rules="{ required: true, message: '请选择处分决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjg6Text}}</div>
          <el-select v-model="editForm.cljdjg6" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处分决定机关" prop="qtcljdjg6" v-show="editForm.cljdjg6==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg6}}</div>
          <el-input v-model="editForm.qtcljdjg6" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处分决定时间" prop="cljdsj6" :rules="{ required: true, message: '请选择处分决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj6}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj6"
            placeholder="请选择处分决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq6" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxq6Text}}</div>
          <el-select v-model="editForm.yxq6" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq6" v-show="editForm.yxq6==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq6}}</div>
          <el-input v-model="editForm.qtyxq6" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws6" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws6}}</div>
          <el-input v-model="editForm.jdws6" v-else></el-input>
        </el-form-item>
      </fieldset>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showDjcf">
        <legend>党纪处分</legend>
        <el-form-item label="处分决定机关" prop="cljdjg2" :rules="{ required: true, message: '请选择处分决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjg2Text}}</div>
          <el-select v-model="editForm.cljdjg2" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处分决定机关" prop="qtcljdjg2" v-show="editForm.cljdjg2==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg2}}</div>
          <el-input v-model="editForm.qtcljdjg2" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处分决定时间" prop="cljdsj2" :rules="{ required: true, message: '请选择处分决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj2}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj2"
            placeholder="请选择处分决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq2" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxq2Text}}</div>
          <el-select v-model="editForm.yxq2" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq2" v-show="editForm.yxq2==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq2}}</div>
          <el-input v-model="editForm.qtyxq2" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws2" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws2}}</div>
          <el-input v-model="editForm.jdws2" v-else></el-input>
        </el-form-item>
      </fieldset>
      <fieldset style="margin-bottom:20px;padding:20px" v-if="showQt">
        <legend>其他</legend>
        <el-form-item label="处理决定机关" prop="cljdjg5" :rules="{ required: true, message: '请选择处理决定机关', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdjg5Text}}</div>
          <el-select v-model="editForm.cljdjg5" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in cljdjgDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他处理决定机关" prop="qtcljdjg5" v-show="editForm.cljdjg5==='1006'">
          <div v-if="readOnly" class="details">{{editForm.qtcljdjg5}}</div>
          <el-input v-model="editForm.qtcljdjg5" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="处理决定时间" prop="cljdsj5" :rules="{ required: true, message: '请选择处理决定时间', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.cljdsj5}}</div>
          <el-date-picker v-else
            v-model="editForm.cljdsj5"
            placeholder="请选择处理决定时间"
            value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <div style="clear:both"></div>
        <el-form-item label="影响期" prop="yxq5" :rules="{ required: true, message: '请选择影响期', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.yxq5Text}}</div>
          <el-select v-model="editForm.yxq5" placeholder="请选择" v-else>
            <el-option v-for="(item, index) in yxqDic" :key="index" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="其他影响期" prop="qtyxq5" v-show="editForm.yxq5==='1105'">
          <div v-if="readOnly" class="details">{{editForm.qtyxq5}}</div>
          <el-input v-model="editForm.qtyxq5" style="width:220px" v-else></el-input>
        </el-form-item>
        <el-form-item label="决定文书" prop="jdws5" :rules="{ required: true, message: '请输入决定文书', trigger: 'blur' }">
          <div v-if="readOnly" class="details">{{editForm.jdws5}}</div>
          <el-input v-model="editForm.jdws5" v-else></el-input>
        </el-form-item>
      </fieldset>
      <div style="clear:both"></div>
      <el-form-item label="处理处分执行情况" prop="clzxqk" :rules="{ required: true, message: '请输入处理处分执行情况', trigger: 'blur' }">
        <div v-if="readOnly" class="details" v-html="editForm.clzxqk?editForm.clzxqk.replace(/\n/g,'<br>'):''"></div>
        <el-input type="textarea" v-model="editForm.clzxqk" style="width:965px"  v-else></el-input>
      </el-form-item>
      <div style="clear:both"></div>
      <el-form-item label="备注" prop="remark">
        <div v-if="readOnly" class="details" v-html="editForm.remark?editForm.remark.replace(/\n/g,'<br>'):''"></div>
        <el-input type="textarea" v-model="editForm.remark" style="width:965px" v-else></el-input>
      </el-form-item>
    </el-form>
    <div style="margin:0 200px">
      <el-button type="primary" @click.native="editFormSubmit" :loading="saveloading" v-if="!readOnly">保存</el-button>
      <el-button @click.native="backToList">返回</el-button>
    </div>
  </div>
</template>

<script>
export default {
  watch: {
    data: {
      handler (val) {
        this.init(val)
      },
      immediate: true
    },
    readOnly: {
      handler (val) {
        console.log('data:' + val)
        if (val) {
          if (this.$refs['editForm']) {
            this.$refs['editForm'].resetFields()
          }
        }
      },
      immediate: true
    },
    timestamp: {
      handler (val) {
        this.formatDicsFromList()
        if (this.$refs['editForm']) {
          this.$refs['editForm'].resetFields()
        }
        this.init(this.data)
      },
      immediate: true
    }
  },
  props: {
    listdics: {},
    data: '',
    readOnly: '',
    timestamp: ''
  },
  data () {
    return {
      showZjcf: false,
      showDjcf: false,
      showRcjdglfs: false,
      showZzcl: false,
      showQt: false,
      showZwcf: false,
      qtcllx: {},
      cllx: [],
      pageLoading: false,
      editForm: {
        id: '',
        xm: '',
        idcardno: '',
        xb: '',
        dw: '',
        zw: '',
        zwcc: '',
        zywgwjwtzy: '',
        wtly: '',
        qtwtly: '',
        wtrd: '',
        cllx: '',
        qtcllx: '',
        clnr: '',
        cljdjg: '',
        qtcljdjg: '',
        clzxqk: '',
        yxq: '',
        qtyxq: '',
        jdws: '',
        remark: '',
        bm: '',
        lasj: '',
        lajdjg: '',
        cljdjg2: '',
        qtcljdjg2: '',
        cljdsj2: '',
        yxq2: '',
        qtyxq2: '',
        jdws2: '',
        cljdjg3: '',
        qtcljdjg3: '',
        cljdsj3: '',
        yxq3: '',
        qtyxq3: '',
        jdws3: '',
        cljdjg4: '',
        qtcljdjg4: '',
        cljdsj4: '',
        yxq4: '',
        qtyxq4: '',
        jdws4: '',
        cljdjg5: '',
        qtcljdjg5: '',
        cljdsj5: '',
        yxq5: '',
        qtyxq5: '',
        jdws5: '',
        cljdjg6: '',
        qtcljdjg6: '',
        cljdsj6: '',
        yxq6: '',
        qtyxq6: '',
        jdws6: ''
      },
      cllxDic: [],
      wtlyDic: [],
      cljdjgDic: [],
      cljdjgDic2: [],
      yxqDic: [],
      saveloading: false
    }
  },
  methods: {
    formatDicsFromList () {
      this.wtlyDic = this.listdics.wtlyDic
      this.cllxDic = this.listdics.cllxDic
      this.cljdjgDic = this.listdics.cljdjgDic
      this.cljdjgDic2 = this.listdics.cljdjgDic2
      this.yxqDic = this.listdics.yxqDic
    },
    changeCllx () {
      if (this.cllx) {
        console.log(this.cllx)
        console.log(this.cllx.filter(item => item.indexOf('0903') > -1))
        console.log(this.cllx.filter(item => item.indexOf('0904') > -1))
        this.showZjcf = this.cllx.filter(item => item.indexOf('0903') > -1).length > 0
        if (!this.showZjcf) {
          this.editForm.cljdjg = ''
          this.editForm.qtcljdjg = ''
          this.editForm.cljdsj = ''
          this.editForm.yxq = ''
          this.editForm.qtyxq = ''
          this.editForm.jdws = ''
        }
        this.showDjcf = this.cllx.filter(item => item.indexOf('0904') > -1).length > 0
        if (!this.showDjcf) {
          this.editForm.cljdjg2 = ''
          this.editForm.qtcljdjg2 = ''
          this.editForm.cljdsj2 = ''
          this.editForm.yxq2 = ''
          this.editForm.qtyxq2 = ''
          this.editForm.jdws2 = ''
        }
        this.showRcjdglfs = this.cllx.filter(item => item.indexOf('0901') > -1).length > 0
        if (!this.showRcjdglfs) {
          this.editForm.cljdjg3 = ''
          this.editForm.qtcljdjg3 = ''
          this.editForm.cljdsj3 = ''
          this.editForm.yxq3 = ''
          this.editForm.qtyxq3 = ''
          this.editForm.jdws3 = ''
        }
        this.showZzcl = this.cllx.filter(item => item.indexOf('0902') > -1).length > 0
        if (!this.showZzcl) {
          this.editForm.cljdjg4 = ''
          this.editForm.qtcljdjg4 = ''
          this.editForm.cljdsj4 = ''
          this.editForm.yxq4 = ''
          this.editForm.qtyxq4 = ''
          this.editForm.jdws4 = ''
        }
        this.showQt = this.cllx.filter(item => item.indexOf('0905') > -1).length > 0
        if (!this.showQt) {
          this.editForm.cljdjg5 = ''
          this.editForm.qtcljdjg5 = ''
          this.editForm.cljdsj5 = ''
          this.editForm.yxq5 = ''
          this.editForm.qtyxq5 = ''
          this.editForm.jdws5 = ''
        }
        this.showZwcf = this.cllx.filter(item => item.indexOf('0906') > -1).length > 0
        if (!this.showZwcf) {
          this.editForm.cljdjg6 = ''
          this.editForm.qtcljdjg6 = ''
          this.editForm.cljdsj6 = ''
          this.editForm.yxq6 = ''
          this.editForm.qtyxq6 = ''
          this.editForm.jdws6 = ''
        }
      }
    },
    init (data) {
      this.showZjcf = false
      this.showDjcf = false
      this.showRcjdglfs = false
      this.showZzcl = false
      this.showQt = false
      this.showZwcf = false
      console.log(data)
      if (JSON.stringify(data) === '{}') { // 新增未关联举报
        this.editFormReset()
      } else {
        if (data.edittype === 'add') {
          console.log('addnew')
          this.editForm.wtly = '0802'
          this.editForm.zywgwjwtzy = data.caseComment
          this.getPersonList(data.id)
        } else if (data.edittype === 'edit') {
          if (data && data.id && data.id !== '') { // 编辑
            this.editForm = data
            if (this.editForm.cllx) {
              this.cllx = this.editForm.cllx.split(',')
            } else {
              this.cllx = []
            }
            if (this.editForm.qtcllx && this.editForm.qtcllx !== '') {
              try {
                this.qtcllx = JSON.parse(this.editForm.qtcllx)
              } catch (e) {
                this.qtcllx = this.editForm.qtcllx
              }
            }
            this.changeCllx()
          }
        }
      }
    },
    getPersonList (id) {
      if (id) {
        console.log('getPersonList...')
        this.pageLoading = true
        this.$http
          .get(this.$http.defaults.selectionAPI + `api/busClueReport/queryPersonsByReport?clueReportId=` + id)
          .then(response => {
            this.pageLoading = false
            if (response.data.success) {
              this.personlist = response.data.result
              if (this.personlist.length > 0) {
                this.editForm.dw = this.personlist[0].unit
                this.editForm.idcardno = this.personlist[0].idCardNo
                this.editForm.xm = this.personlist[0].name
                this.editForm.zw = this.personlist[0].job
              }
            } else {
              this.$message({
                message: '获取失败:' + response.data.message,
                type: 'error'
              })
            }
          })
          .catch(error => {
            this.pageLoading = false
            this.$message({
              message: '网络获取失败:' + error,
              type: 'error'
            })
          })
      }
    },
    backToList () {
      this.$emit('dialogHide', false)
    },
    detail (idcardNo) {
      this.$http
        .get(this.$http.defaults.selectionAPI + `api/selection/jiben/getIdByIdCardNo?idcard=` + idcardNo)
        .then(response => {
          if (response.data.success) {
            if (response.data.result) {
              this.persondetail(response.data.result)
            } else {
              this.$message({
                message: '无此人选的干部全方位情况',
                type: 'error'
              })
            }
          } else {
            this.$message({
              message: '查询失败:无此人选的干部全方位情况',
              type: 'error'
            })
          }
        })
        .catch(function () {
          this.$message({
            message: '查询失败:无此人选的干部全方位情况',
            type: 'error'
          })
        })
    },
    handleSelect (item) {
      this.editForm.idcardno = item.idcardno
      this.editForm.zw = item.job
      this.editForm.bm = item.bm
      this.editForm.zwcc = item.jobLevel
      this.editForm.xb = item.sex === '1' ? '男' : '女'
    },
    querySearch (queryString, cb) {
      return this.getunits(this, queryString, cb)
    },
    getunits (self, queryString, cb) {
      let para = {
        unitname: queryString
      }
      self.$http
        .post(`/api/prj/searchunit/`, para)
        .then(function (response) {
          console.log('获取成功')
          var results = response.data
          let newArr = []
          results.forEach(function (item) {
            let obj = {'value': item}
            newArr.push(obj)
          })
          cb(newArr)
        })
        .catch(function (error) {
          console.log(error)
        })
    },
    searchPerson (queryString, cb) {
      return this.getpersons(this, queryString, cb)
    },
    getpersons (self, queryString, cb) {
      let para = {
        realname: queryString,
        unitname: this.editForm.dw
      }
      console.log(para)
      self.$http
        .get(this.$http.defaults.selectionAPI + `api/selection/jiben`, {params: para})
        .then(function (response) {
          console.log('获取成功')
          var results = response.data.result
          let newArr = []
          results.forEach(function (item) {
            let obj = {'value': item.a0101, 'idcardno': item.a0184, 'job': item.a0215a, 'bm': item.a0201a, 'jobLevel': item.a0221, 'sex': item.a0104}
            newArr.push(obj)
          })
          cb(newArr)
        })
        .catch(function (error) {
          console.log(error)
        })
    },
    getDics (code) {
      this.$http
        .get(this.$http.defaults.selectionAPI + `api/sysDict/getByCode?code=` + code)
        .then(response => {
          if (response.data.success) {
            switch (code) {
              case '08':
                this.wtlyDic = response.data.result
                break
              case '09':
                this.cllxDic = response.data.result
                break
              case '10':
                this.cljdjgDic = response.data.result
                break
              case '17':
                this.cljdjgDic2 = response.data.result
                break
              case '11':
                this.yxqDic = response.data.result
                break
            }
          } else {
            this.$message({
              message: '获取失败:' + response.data.message,
              type: 'error'
            })
          }
        })
        .catch(error => {
          console.log(error)
          this.$message({
            message: '网络获取失败:' + error,
            type: 'error'
          })
        })
    },
    getAllDics () {
      this.getDics('08')
      this.getDics('09')
      this.getDics('10')
      this.getDics('17')
      this.getDics('11')
    },
    editFormReset () {
      this.editForm = {
        id: '',
        xm: '',
        idcardno: '',
        xb: '',
        dw: '',
        zw: '',
        zwcc: '',
        zywgwjwtzy: '',
        wtly: '',
        qtwtly: '',
        wtrd: '',
        cllx: '',
        qtcllx: '',
        clnr: '',
        cljdjg: '',
        qtcljdjg: '',
        cljdsj: '',
        clzxqk: '',
        yxq: '',
        qtyxq: '',
        jdws: '',
        remark: '',
        bm: '',
        lasj: '',
        lajdjg: '',
        cljdjg2: '',
        qtcljdjg2: '',
        cljdsj2: '',
        yxq2: '',
        qtyxq2: '',
        jdws2: '',
        cljdjg3: '',
        qtcljdjg3: '',
        cljdsj3: '',
        yxq3: '',
        qtyxq3: '',
        jdws3: '',
        cljdjg4: '',
        qtcljdjg4: '',
        cljdsj4: '',
        yxq4: '',
        qtyxq4: '',
        jdws4: '',
        cljdjg5: '',
        qtcljdjg5: '',
        cljdsj5: '',
        yxq5: '',
        qtyxq5: '',
        jdws5: '',
        cljdjg6: '',
        qtcljdjg6: '',
        cljdsj6: '',
        yxq6: '',
        qtyxq6: '',
        jdws6: ''
      }
      this.cllx = []
      this.qtcllx = {}
    },
    editFormSubmit () {
      function arr2string (arr) {
        if (arr && arr.length > 0) {
          let string = arr[0]
          for (let i = 1; i < arr.length; i++) {
            string = string + ',' + arr[i]
          }
          return string
        } else {
          return ''
        }
      }
      function obj2string (obj, codeArr) {
        if (codeArr) {
          console.log('obj')
          console.log(obj)
          console.log(JSON.stringify(obj))
          // if (codeArr.indexOf('090105') === -1) {
          //   obj['090105'] = ''
          // }
          // if (codeArr.indexOf('090206') === -1) {
          //   obj['090206'] = ''
          // }
          if (codeArr.indexOf('0905') === -1) {
            obj['0905'] = ''
          }
          let string = JSON.stringify(obj)
          return string
        } else {
          return ''
        }
      }
      this.$refs.editForm.validate((valid) => {
        if (valid) {
          let para = {
            id: this.editForm.id,
            xm: this.editForm.xm,
            idcardno: this.editForm.idcardno,
            xb: this.editForm.xb,
            dw: this.editForm.dw,
            zw: this.editForm.zw,
            zwcc: this.editForm.zwcc,
            zywgwjwtzy: this.editForm.zywgwjwtzy,
            wtly: this.editForm.wtly,
            qtwtly: this.editForm.qtwtly,
            wtrd: this.editForm.wtrd,
            cllx: arr2string(this.cllx),
            qtcllx: obj2string(this.qtcllx, this.cllx),
            clnr: this.editForm.clnr,
            cljdjg: this.editForm.cljdjg,
            cljdjg2: this.editForm.cljdjg2,
            cljdjg3: this.editForm.cljdjg3,
            cljdjg4: this.editForm.cljdjg4,
            cljdjg5: this.editForm.cljdjg5,
            cljdjg6: this.editForm.cljdjg6,
            qtcljdjg: this.editForm.qtcljdjg,
            qtcljdjg2: this.editForm.qtcljdjg2,
            qtcljdjg3: this.editForm.qtcljdjg3,
            qtcljdjg4: this.editForm.qtcljdjg4,
            qtcljdjg5: this.editForm.qtcljdjg5,
            qtcljdjg6: this.editForm.qtcljdjg6,
            cljdsj: this.editForm.cljdsj,
            cljdsj2: this.editForm.cljdsj2,
            cljdsj3: this.editForm.cljdsj3,
            cljdsj4: this.editForm.cljdsj4,
            cljdsj5: this.editForm.cljdsj5,
            cljdsj6: this.editForm.cljdsj6,
            clzxqk: this.editForm.clzxqk,
            yxq: this.editForm.yxq,
            yxq2: this.editForm.yxq2,
            yxq3: this.editForm.yxq3,
            yxq4: this.editForm.yxq4,
            yxq5: this.editForm.yxq5,
            yxq6: this.editForm.yxq6,
            qtyxq: this.editForm.qtyxq,
            qtyxq2: this.editForm.qtyxq2,
            qtyxq3: this.editForm.qtyxq3,
            qtyxq4: this.editForm.qtyxq4,
            qtyxq5: this.editForm.qtyxq5,
            qtyxq6: this.editForm.qtyxq6,
            jdws: this.editForm.jdws,
            jdws2: this.editForm.jdws2,
            jdws3: this.editForm.jdws3,
            jdws4: this.editForm.jdws4,
            jdws5: this.editForm.jdws5,
            jdws6: this.editForm.jdws6,
            remark: this.editForm.remark,
            bm: this.editForm.bm,
            lasj: this.editForm.lasj,
            lajdjg: this.editForm.lajdjg
          }
          this.saveloading = true
          this.$http
            .post(this.$http.defaults.selectionAPI + `api/busClueReportProcess/save`, para)
            .then(response => {
              this.saveloading = false
              if (response.data.success) {
                this.$message({
                  message: '保存成功',
                  type: 'success'
                })
                this.editFormReset()
                this.$emit('dialogHide', true)
              } else {
                this.$message({
                  message: '保存失败:' + response.data.message,
                  type: 'error'
                })
              }
            })
            .catch(error => {
              this.saveloading = false
              console.log(error)
              this.$message({
                message: '网络保存失败:' + error,
                type: 'error'
              })
            })
        }
      })
    }
  },
  mounted () {
    this.getAllDics()
  }
}
</script>
<style>
  #cluereportedit h1{
    font-size:var(--size16) !important;
    font-weight: bolder;
    height: 30px;
    border-bottom: 1px solid #95B8E7;
    font-family: '宋体';
    line-height: 30px;
    color: #000;
    padding-left:10px;
    background-image: linear-gradient(to bottom , #EEF4FF, #E0ECFF);
    margin:0 0 20px;
  }
  #cluereportedit .el-table{
    border: #95B8E7 solid 1px;
  }
</style>
<style scoped>
.details{
  font-weight:bolder;
  border-bottom:1px solid #95B8E7;
  padding:0 10px;
  min-height: 36px;
}
</style>
